<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Expires" content="0" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Cache" content="no-cache" />
    <link rel="icon" href="favicon.ico" />
    <title>向导页</title>
    <style>
      #app {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        margin: 0 auto;
        width: 80%;
      }
      .grid-2 {
        width: 50%;
        box-sizing: border-box;
        padding: 100px;
      }
      .box {
        height: 100%;
        border: 1px solid #f6f6f7;
        border-radius: 12px;
        background-color: #e9effa;
        transition: border-color 0.25s, background-color 0.25s;
        display: flex;
        flex-direction: column;
        padding: 24px;
      }
      .icon {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 20px;
        border-radius: 6px;
        background-color: rgba(142, 150, 170, 0.14);
        width: 48px;
        height: 48px;
        font-size: 24px;
        transition: background-color 0.25s;
      }
      .title {
        line-height: 24px;
        font-size: 16px;
        font-weight: 600;
      }
      .detail {
        flex-grow: 1;
        padding-top: 8px;
        line-height: 24px;
        font-size: 14px;
        font-weight: 500;
        color: rgba(60, 60, 67, 0.78);
      }
      a {
        text-decoration: none;
      }
    </style>
  </head>
  <body>
    <div id="app">
      <div class="grid-2">
        <a href="admin">
          <div class="box">
            <div class="icon">🛠️</div>
            <div class="title">admin</div>
            <div class="detail">admin项目描述：多入口项目主页面</div>
          </div>
        </a>
      </div>
      <div class="grid-2">
        <a href="other">
          <div class="box">
            <div class="icon">📦</div>
            <div class="title">other</div>
            <div class="detail">other项目描述：多入口项目次页面</div>
          </div>
        </a>
      </div>
    </div>
  </body>
</html>
